import { defineConfig } from "vite"
import vue from "@vitejs/plugin-vue"
import path from "path"
import Components from "unplugin-vue-components/vite"
import {
  NaiveUiResolver,
  ElementPlusResolver,
} from "unplugin-vue-components/resolvers"
import { visualizer } from 'rollup-plugin-visualizer'
//Gzip文件压缩
import viteCompression from 'vite-plugin-compression'
export default defineConfig({
  plugins: [
    vue({
      script: {
        // 开启 defineModel
        defineModel: true,
      },
    }),
    Components({
      resolvers: [
        // naive ui 的自动引入
        NaiveUiResolver(),
        ElementPlusResolver(),
      ],
    }),
    visualizer({
      open: true,
      filename: 'visualizer.html' //分析图生成的文件名
    }),
    viteCompression({
      filter: /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i, // 需要压缩的文件
      threshold: 1024, // 文件容量大于这个值进行压缩
      algorithm: 'gzip', // 压缩方式
      ext: 'gz', // 后缀名
      deleteOriginFile: true, // 压缩后是否删除压缩源文件
    })
  ],
  //路径重写
  resolve: {
    alias: {
      "@": path.resolve("./src"),
    },
  },
  server: {
    open: true,
    proxy: {
      "/api": {
        target: "http://127.0.0.1:10001",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  },
  css: {
    // css预处理器
    preprocessorOptions: {
      less: {
        charset: false,
        additionalData: '@import "@/assets/less/global.less";',
      },
    },
  },
  build: {
    rollupOptions: {
      output: {
        chunkFileNames: 'js/[name]-[hash].js', // 引入文件名的名称
        entryFileNames: 'js/[name]-[hash].js', // 包的入口文件名称
        assetFileNames: '[ext]/[name]-[hash].[ext]', // 资源文件像 字体，图片等
      }
    },
    minify: 'terser',
    // 清除所有console和debugger
    terserOptions: {
      compress: {
        drop_console: true,
        drop_debugger: true
      }
    }
  }
})
